import Sheet from "@/components/Sheet";
import axios from 'axios'
import { Card, Space, Button, DatePicker, Select, Modal, Tabs, message, Upload, Input, Flex, Typography, Popconfirm, Splitter } from "antd";
import { useState, useEffect } from "react";
import { useDispatch } from "react-redux";
import BtnTool from "@/components/BtnTool";
import { setShowBtnTool } from "@/store/modules/style";
import { sikuhshsearchtplAPI, timeintervaldataAPI, timeintervaltpldataAPI, sikuhshdeletealltplAPI } from "@/apis";
import { InboxOutlined, DownloadOutlined, SyncOutlined } from '@ant-design/icons';
const columns = [
  {
    title: '批次号',
    dataIndex: 'PCH',
  },
  {
    title: '创建人',
    dataIndex: 'CREATOR',
  },
  {
    title: '创建时间',
    dataIndex: 'CREATE_TIME',
  },
  {
    title: '序号',
    dataIndex: 'ID',
  },
  {
    title: '编号',
    dataIndex: 'CODE',
  },
  {
    title: '分析报告批次',
    dataIndex: 'FXBGPC' 
  },
  {
    title: '提供时间',
    dataIndex: 'TGSJ'
  },
  {
    title: '所属二级',
    dataIndex: 'SSEJ'
  },
  {
    title: '成员单位',
    dataIndex: 'CYDW'
  },
  {
    title: '交易对手',
    dataIndex: 'JYDS'
  },
  {
    title: '涉险类型',
    dataIndex: 'SXLX'
  },
  {
    title: '交易类型',
    dataIndex: 'JYLX'
  },
  {
    title: '交易笔数',
    dataIndex: 'JYBS'
  },
  {
    title: '交易金额（万元）',
    dataIndex: 'JYJE'
  },
  {
    title: '反馈情况',
    dataIndex: 'FKQK'
  },
  {
    title: '命中情况',
    dataIndex: 'MZQK'
  }
]
export default function VerifyHshModal( params ) {
    // 分页参数
    const [lpage, setLPage] = useState({ pageNum: 1, pageSize: 10 });
    const [rpage, setRPage] = useState({ pageNum: 1, pageSize: 10 });
    // 数据源
    const [dataSource, setDataSource] = useState({ data: [], total: 0 });
    const [tpldataSource, setTplDataSource] = useState({ data: [], total: 0 });
    // 搜索参数状态
    const [searchParams, setSearchParams] = useState({});
    // 左侧选中行
    const [leftselectedRowKeys, setLeftSelectedRowKeys] = useState([]);
    const [leftselectedRows, setLeftSelectedRows] = useState([]);
    // 右侧选中行
    const [rightselectedRowKeys, setRightSelectedRowKeys] = useState([]);
    const [rightselectedRows, setRightSelectedRows] = useState([]);
    // 加载状态
    const [loading, setLoading] = useState(false); 
    const dispatch = useDispatch();
    // 获取数据方法
    const fetchData = async () => {
        setLoading(true);
        try {
            const res = await timeintervaldataAPI({
              type: params.params.type,
              start_time: params.params.starttime,
              end_time: params.params.endtime,
              pageNum: lpage.pageNum,
              pageSize: lpage.pageSize
            });
            
            // 根据实际API响应结构调整
            setDataSource({
              data: res.data.data || [],
              total: res.data.total || 0
            });
        } catch (error) {
            console.error('数据获取失败:', error);
        } finally {
            setLoading(false);
        }
    };
    const fetchtplData = async () => {
        setLoading(true);
        try {
            const res = await timeintervaltpldataAPI({
              type: params.params.type,
              start_time: params.params.starttime,
              end_time: params.params.endtime,
              pageNum: rpage.pageNum,
              pageSize: rpage.pageSize
            });
            
            // 根据实际API响应结构调整
            setTplDataSource({
              data: res.data.data || [],
              total: res.data.total || 0
            });
        } catch (error) {
            console.error('数据获取失败:', error);
        } finally {
            setLoading(false);
        }
    };
    // 当page或searchParams变化时重新获取数据
    useEffect(() => {
        fetchData();
        fetchtplData();
    }, [lpage, rpage, params]);
    const handleLPage = (pageNum, pageSize) => {
        setLPage({ pageNum, pageSize });
    };
    const handleRPage = (pageNum, pageSize) => {
        setRPage({ pageNum, pageSize });
    };
    const handleLeftSelChange = (keys, rows) => {
        setLeftSelectedRowKeys(keys);
        setLeftSelectedRows(rows)
        dispatch(setShowBtnTool(keys.length > 0));
    };
    const handleRightSelChange = (keys, rows) => {
        setRightSelectedRowKeys(keys);
        setRightSelectedRows(rows)
        dispatch(setShowBtnTool(keys.length > 0));
    };
    const leftRowSelection = {
        leftselectedRowKeys,
        onChange: handleLeftSelChange,
    };
    const rightRowSelection = {
        rightselectedRowKeys,
        onChange: handleRightSelChange,
    };
    // 左侧删除
    const handleLeftDel = () => {
        // console.log('删除的 keys:', selectedRowKeys);
        // console.log('删除的数据:', selectedRows);
        let ids = {
            "ids": leftselectedRowKeys
        }
        sikuhshdeletealltplAPI({
            params: ids
        }).then((res) => {
            if (res.code == 200){
                message.success(res.message);
                // 刷新数据
                fetchData();
            }else{
                message.error(res.message);
            }
        }).catch(() => {
            message.error("删除失败！")
        })
    };
    return (
        <div>
            <Flex vertical>
                <div>
                    <Splitter style={{ boxShadow: '0 0 10px rgba(0, 0, 0, 0.1)' }}>
                        <Splitter.Panel defaultSize="50%" min="20%" max="80%">
                            <Flex vertical='vertical'>
                                <Flex style={{ marginTop: 5 }} justify={'center'} align={'center'}>
                                    <h3>当前导入符合区间的数据</h3>
                                </Flex>
                                <Flex  justify={'flex-start'} align={'center'}> 
                                    <div>
                                        <Sheet 
                                            columns={columns} 
                                            dataSource={{
                                                data: tpldataSource.data,
                                                total: tpldataSource.total
                                            }} 
                                            rowSelection={leftRowSelection} 
                                            rowKey='ID' 
                                            page={lpage} 
                                            onChange={handleLPage}
                                            loading={loading}
                                        />
                                    </div>
                                </Flex>
                            </Flex>
                            <BtnTool 
                                total={`已选择 ${leftselectedRowKeys.length} 项`} 
                                isShow={leftselectedRowKeys.length > 0} 
                                isSave={false} 
                                onDel={handleLeftDel}
                                isFixed={false}
                            />
                        </Splitter.Panel>
                        <Splitter.Panel>
                            <Flex vertical='vertical'>
                                <Flex style={{ marginTop: 5 }} justify={'center'} align={'center'}>
                                    <h3>数据库中符合区间的数据</h3>
                                </Flex>
                                <Flex  justify={'flex-start'} align={'center'}>
                                    <div>
                                        <Sheet 
                                            columns={columns} 
                                            dataSource={{
                                                data: dataSource.data,
                                                total: dataSource.total
                                            }} 
                                            rowSelection={rightRowSelection} 
                                            rowKey='ID' 
                                            page={rpage} 
                                            onChange={handleRPage}
                                            loading={loading}
                                        />
                                    </div> 
                                </Flex>  
                            </Flex>
                        </Splitter.Panel>
                    </Splitter>
                </div>
                <div>
                    <Flex style={{ marginTop: 20 }} justify={'space-between'} align={'center'} horizontal > 
                        <Button>取消</Button>
                        <Button type="primary" style={{
                            backgroundColor: '#67C23A',
                            borderColor: '#67C23A',
                            color: 'white',
                        }}>同步替换</Button>
                    </Flex>
                </div>
            </Flex>
        </div>
    )
}